<template>
	<div class="userMessage-container">
		<div class="user-info">
			<div class="rowop">
				<span>姓名:</span>
				<i>{{ userMessageData.name ? userMessageData.name : '- -' }}</i>
			</div>
			<div class="rowop">
				<span>手机号:</span>
				<i>{{ userMessageData.mobile ? userMessageData.mobile : '- -' }}</i>
			</div>
			<div class="rowop">
				<span>业务类型:</span>
				<i>{{ userMessageData.businessType ? userMessageData.businessType : '- -' }}</i>
			</div>
			<div class="rowop">
				<span>身份证号:</span>
				<i>{{ userMessageData.IDCard ? userMessageData.IDCard : '- -' }}</i>
			</div>
			<div class="rowop">
				<span>常住地址:</span>
				<i>{{ userMessageData.address ? userMessageData.address : '- -' }}</i>
			</div>
			<div class="rowop">
				<span>公司名称:</span>
				<i>{{ userMessageData.company ? userMessageData.company : '- -' }}</i>
			</div>
			<div class="rowop">
				<span>地理位置:</span>
				<i>{{ userMessageData.locationAddress ? userMessageData.locationAddress : '- -' }}</i>
			</div>
		</div>
	</div>
</template>

<script>
import { getUserMessage } from '../../api/api';
export default {
	props: {
		sessionId: {
			type: String,
			require: true,
			default: () => ''
		}
	},
	async mounted() {
		await this.initUserMessageList()
			.then()
			.catch(() => {});
	},
	data() {
		return {
			// 用户信息数据
			userMessageData: {}
		};
	},
	methods: {
		initUserMessageList() {
			return new Promise((resolve, reject) => {
				getUserMessage(this.sessionId)
					.then(res => {
						console.log(res.data, '获取用户信息');
						const data = res.data;
						this.userMessageData = {
							name: data.name,
							mobile: data.mobile,
							businessType: data.productCategory,
							IDCard: data.ID,
							address: data.address,
							company: data.company,
							locationAddress: data.locationAddress
						};
						resolve(this.userMessageData);
					})
					.catch(err => {
						console.log(err);
						reject(err);
						this.$requestApiError(err, () => {
							this.$router.push('/');
						});
					});
			});
		}
	}
};
</script>

<style scoped lang="less">
.user-info {
	width: 100%;
	height: 300px;
	padding: 10px 0;
	background: #fbfbfb;
	border: 1px solid #f3f3f3;
	border-radius: 4px;
	margin-top: 20px;
}
.rowop {
	display: flex;
	flex-direction: row;
	width: 100%;
	justify-content: flex-start;
	align-items: center;
	margin-top: 10px;
	span {
		width: 70px;
		font-size: 14px;
		font-family: PingFang SC;
		font-weight: 400;
		color: #848484;
		margin: 5px 0px 0 20px;
	}
	i {
		font-size: 14px;
		font-family: PingFang SC;
		font-weight: 400;
		color: #333;
		margin: 5px 0 0 30px;
		text-align: left;
		font-style: normal;
	}
}
</style>
